<template>
  <view class="order_list">
    <AtMessage />
    <view class="order_stat">
      <text class="stat_title">共{{orderCount.total_order}}</text> 笔
      <text class="stat_title">{{orderCount.total_amount}}</text> 元
      <view class="refresh_button" @tap="refushData">刷 新</view>
    </view>
    
    <scroll-view scrollY="true"
      class="scroll_box"
      v-if="listData.length"
      @scrolltolower="lower">
      <view class="order_item" v-for="(item,index) in listData" :key="index">
        <view class="item_msg">
          <view class="line_1">{{item.ordersn}}</view>
          <view class="line_1">{{item.create_time}}</view>
        </view>
        <view class="item_button" v-if="item.pay_status == '1'&& item.payment_code == 'cash'">
          <view class="item_button_primary" @tap="confirmOrder(item.ordersn,item.amount,1)">确认支付</view>
          <view class="item_button_cancel" @tap="confirmOrder(item.ordersn,item.amount,2)">取消订单</view>
        </view>
      </view>
      <AtLoadMore style="height:40px" noMoreText="没有更多了" :status="loadingStatus"/>
    </scroll-view>
    <!-- 未支付订单 确认/取消 服务市场-->
    <AtFloatLayout :isOpened="show_confirm" :title="confirm_title" :onClose="handleCloseConfirm">
      <view class="confirm_data">
        <view class="confirm_line">订单编号：{{confirmData.ordersn}}</view>
        <view class="confirm_line">订单金额：{{confirmData.price}} 元</view>
      </view>
      <view class="confirm_button confirm_button_1" v-if="confirmType == 1" @tap="orderConfirm()">确认支付</view>
      <view class="confirm_button confirm_button_2" v-if="confirmType == 2" @tap="orderCancel()">取消订单</view>
    </AtFloatLayout>
    <AtToast :isOpened="confirmLoading" text="正在提交..." hasMask icon="loading-2" ></AtToast>
  </view>
</template>

<script>
import Taro from '@tarojs/taro'
import { AtMessage } from 'taro-ui'
import Row from './row'
import './order.module.scss'
import OrderAPI from '../../api/order.js'
export default {
  name: 'order',
  components: {
    Row
  },
  data(){
    return{
      listData: [], // 订单列表数据
      orderCount: {
        receipt: 0,
        take_money: null,
        total_amount: "0.00",
        total_fee: "0.00",
        total_money: "0.00",
        total_num: "0.00",
        total_discount: "--",
        total_order: 0,
        waitcash: 0
      }, // 统计数据
      page: 1, // 页码
      total: 0, // 总数
      params: {
        order: 0, // 订单接口 0.当前班次 1.全部订单 2.上一班次
        pay_status: 2, // 订单状态：0.全部 1.未支付 2.已支付 3.冻结
        goods_index: 0, // 油品选项index
        payment_index: 0, // 支付方式index
      },
      orderClass: ['当前班次', '全部订单','上一班次'], // 订单接口选项
      statusOptions: ['所有状态','未支付','已支付'], // 订单状态选项
      oilsOptions: [{id: '0',name: "全部油品"}], // 油品选项
      showLoading: false, // 上滑加载更多
      loadingStatus: "more",
      firstIn: true, // 第一次加载数据 防止内容不足一屏高度 加载两页内容
      payment: [
        {id: "0", name: "全部"},
        {id: "wxpay", name: "微信支付"},
        {id: "unionpay", name: "银联支付"},
        {id: "card_balance", name: "加油卡支付"},
        {id: "balance", name: "余额支付"},
        {id: "cash", name: "现金支付"},
        {id: "team_balance", name: "车队卡支付"},
        {id: "family_balance", name: "家庭卡支付"},
        {id: "pos", name: "pos机支付"},
      ], // 支付方式 筛选
      show_confirm: false, // 未支付订单确认/取消弹窗
      confirm_title: "确认订单", // 未支付订单弹窗title
      confirmData: {
        ordersn: "1",
        price: "1"
      }, // 未支付订单信息
      confirmType: 1, // 未支付弹窗类型 1.确认 2.取消
      confirmLoading: false, // 提交loading
    }
  },
  mounted(){
    this.init();
    this.getList();
  },
  methods:{
    async init(){
      const res = await OrderAPI.getOilsOptions();
      if(res.code == 200){
        this.oilsOptions = res.data;
        console.log(res.data)
        console.log('youpin',this.oilsOptions)
        var head = {id: "0",name: "全部油品", type_id: 0};
        this.oilsOptions.unshift(head);
      }
    },
    async getList(){
      var data = {
        page: this.page,
        emp_id: Taro.getStorageSync('emp_id'),
        pay_status: "1",
        payment_code: "cash"
      }
      const res = await OrderAPI.rechargeList(data);
      if(res.code == 400){
        this.loadingStatus = "noMore"
      }
      const resdata = [...this.listData,...res.data];
      // console.log(resdata.map(x=> x.payment_code).join(','))
      this.listData = resdata;
      this.total = res.total;
      if(res.count){
        this.orderCount = Object.assign({},res.count);
        this.orderCount.total_discount = (Number(res.count.total_money)-Number(res.count.total_amount)).toFixed(2)
      }
      
      this.showLoading = false;
      this.page ++;
      if(this.listData.length === this.total) {
        this.loadingStatus = 'noMore'
      }else{
        this.showLoading = false;
        if(this.firstIn){
          this.firstIn = false;
          this.lower();
        }
      }
    },
    lower(e) { // 到底加载更多
      if(!this.showLoading){
        if(this.total != this.listData.length){
          this.showLoading = true;
          this.loadingStatus = 'loading'
          this.getList();
        }
      }
    },
    
    // 刷新
    refushData() {
      this.page = 1;
      this.listData = [];
      this.firstIn = true;
      this.getList();
    },
    // 关闭确认订单弹窗
    handleCloseConfirm(){
      this.show_confirm = false;
    },
    // 未支付订单确认/取消
    confirmOrder(sn,price,type){
      this.confirmType = type;
      this.confirm_title = type == 1? "确认订单":"取消订单";
      this.confirmData = {
        ordersn: sn,
        price: price
      }
      this.show_confirm = true;
    },
    // 确认订单
    async orderConfirm() {
      this.confirmLoading = true;
      var data = {
        ordersn: this.confirmData.ordersn,
        payment_code: "cash"
      }
      const res = await OrderAPI.confirmOrder(data);
      if(res.code == 200){
        this.confirmLoading = false;
        this.show_confirm = false;
        Taro.atMessage({
          message: '订单已确认',
          type: 'success',
          duration: 2000
        })
        this.refushData();
      }
    },
    // 取消订单
    async orderCancel() {
      this.confirmLoading = true;
      var data = {
        ordersn: this.confirmData.ordersn
      }
      const res = await OrderAPI.delOrder(data);
      if(res.code == 200){
        this.confirmLoading = false;
        this.show_confirm = false;
        Taro.atMessage({
          message: '订单已取消',
          type: 'error',
          duration: 2000
        })
        this.refushData();
      }
    },
    
  },
}
</script>